<template>
	<view class="page">
		<u-card v-for="(v, k) in menus" :key="k" :title="v.title" :thumb="v.icon" :thumb-width="40" sub-title-size="30" sub-title-color="#2979ff" :sub-title="v.type == 'crm' ? '快速创建+' : ''" @head-click="toShowMenu(v.type)">
			<view slot="body">
				<u-grid :col="4" :border="false" hover-class="true" v-if="v.children.length > 0">
					<u-grid-item v-for="(sv, sk) in v.children" :key="sk">
						<view class="grid-item-box" @click.stop="toPath(sv, 0)">
							<u-image :src="sv.icon" shape="circle" width="40px" height="40px"></u-image>
							<text class="text">{{ sv.title }}</text>
							<u-badge v-if="sv.authType === 'message'" type="error" :count="todoNum"></u-badge>
						</view>
					</u-grid-item>
				</u-grid>

				<u-empty v-else mode="permission"></u-empty>
			</view>
		</u-card>

		<!-- 快速创建 弹窗 -->
		<u-popup v-model="popup.status" closeable :mode="popup.mode" :length="popup.height" border-radius="10" :safe-area-inset-bottom="true">
			<view class="menu-title popup-title">
				<view class="inner">快速创建</view>
			</view>
			<scroll-view :scroll-y="true" class="popup-body" style="height: 250px">
				<u-grid :col="4" :border="false" hover-class="true" v-if="showCreateMenu.length">
					<u-grid-item v-for="(sv, sk) in showCreateMenu" :key="sk">
						<view class="grid-item-box" @click.stop="toPath(sv, 1)">
							<u-image :src="sv.icon" shape="circle" width="40px" height="40px"></u-image>
							<text class="text">{{ sv.title }}</text>
						</view>
					</u-grid-item>
				</u-grid>
				<u-empty v-else mode="permission"></u-empty>
			</scroll-view>
		</u-popup>
		<u-tabbar :list="vuex_tabbars" class="my-tabbars"></u-tabbar>
	</view>
</template>

<script>
import { sysRouters } from '@/router';

export default {
	data() {
		return {
			show: false,
			showCreateMenu: [],
			menus: [],
			// 代办事项总数
			todoNum: 0,
			// 弹窗信息
			popup: {
				status: false,
				mode: 'bottom',
				height: '300px',
			},
		};
	},
	computed: {},
	onLoad() {},
	onShow() {
		this.initData();
	},
	// 周期函数--监听页面初次渲染完成
	onReady() {
		// this.initData();
	},
	watch: {},
	methods: {
		// 获取本地是否存储信息
		async initData() {
			let onLaunch = uni.getStorageSync('onLaunch') || 0;
			console.log(onLaunch);
			if (onLaunch) {
				uni.navigateTo({
					url: '/pages/login/login',
				});
				uni.setStorageSync('isBack', 0);
				return;
			}
			await this.$store.dispatch('getAuth');
			await this.getMenus();
			this.getTodoNums();
		},
		// 监听自定义标题栏按钮事件
		toMessage() {
			uni.navigateTo({
				url: '/pages/customerManagement/pushMessage/pushMessage',
			});
		},
		// 根据权限重组菜单
		async getMenus() {
			let menus = [];
			let authList = await uni.getStorageSync('authList');
			let allAuth = [];
			console.log(authList);
			// 只有read或者index属性的菜单才会显示
			Object.keys(authList).forEach((v) => {
				Object.keys(authList[v]).forEach((sv) => {
					if (authList[v][sv].read || authList[v][sv].index) {
						allAuth.push(sv);
					}
				});
			});

			if (!allAuth.length) {
				return;
			}

			this.getQuikeMenu(allAuth);

			sysRouters.forEach((v, i) => {
				menus.push({ ...v });
				menus[i].children = [];

				v.children.forEach((sub) => {
					if (allAuth.includes(sub.authType) || sub.authType === 'message') {
						menus[i].children.push(sub);
					}
				});
			});
			//   console.log(menus);
			this.menus = menus;
		},
		// 获取代办事项总数
		async getTodoNums() {
			let res = await this.$api.common.getTodoNum();
			if (res.code === 200) {
				let items = res.data || {};
				let num = 0;
				Object.keys(items).forEach((v) => {
					num += items[v] || 0;
				});

				this.todoNum = num;
			}
		},
		getQuikeMenu(allAuth) {
			this.showCreateMenu = [];
			let showCreateMenu = [
				{
					title: '潜在客户',
					icon: '/static/icon/qzkhjd.png',
					url: '/pages/customerManagement/common/CrmCreateView',
					argType: 'leads',
					authType: 'leads',
				},
				{
					title: '目标客户',
					icon: '/static/icon/mbkhjd.png',
					url: '/pages/customerManagement/common/CrmCreateView',
					argType: 'target',
					authType: 'customer',
				},
				{
					title: '商机',
					icon: '/static/icon/qbsj.png',
					url: '/pages/customerManagement/businessAdd/businessAdd',
					argType: 'business',
					authType: 'business',
				},
				{
					title: '我的日志',
					icon: '/static/icon/wdrz.png',
					url: '/pages/customerManagement/followRecord/followRecordCreateView',
					argType: 'followRecord',
					authType: 'followRecord',
				},
				{
					title: '联系人',
					icon: '/static/icon/lxr.png',
					url: '/pages/customerManagement/common/CrmCreateView',
					argType: 'contacts',
					authType: 'contacts',
				},
				{
					title: '设备清单',
					icon: '/static/icon/sbqd.png',
					url: '/pages/customerManagement/preSalesAdd/preSalesAdd',
					argType: 'preSales',
					authType: 'preSales',
				},
				{
					title: '报价',
					icon: '/static/icon/bjqd.png',
					url: '/pages/customerManagement/quotationAdd/quotationAdd',
					argType: 'quotation',
					authType: 'quotation',
				},
				{
					title: '合同',
					icon: '/static/icon/htqd.png',
					url: '/pages/customerManagement/contractAdd/contractAdd',
					argType: 'contract',
					authType: 'contract',
				},
			];
			showCreateMenu.forEach((sub) => {
				if (allAuth.includes(sub.authType)) {
					this.showCreateMenu.push(sub);
				}
			});
		},
		// 快捷操作按钮
		async toShowMenu(type) {
			if (type !== 'crm') {
				return;
			}
			this.popup.status = true;
		},
		pathToCreate(item) {
			let params = {
				crmType: item.subType,
			};
			uni.navigateTo({
				url: item.url + '?params=' + encodeURIComponent(JSON.stringify(params)),
			});
		},
		toPath(menu, type) {
			this.popup.status = false;

			let url = menu.url + '?type=' + menu.argType + '&crmType=' + menu.authType;

			if (type === 1 && ['leads', 'customer', 'contacts', 'followRecord'].includes(menu.authType)) {
				let params = {
					crmType: menu.authType,
				};
				url = menu.url + '?params=' + encodeURIComponent(JSON.stringify(params));
			}

			uni.navigateTo({
				url: url,
			});
		},
		// 页面处理函数--监听用户下拉动作
		async onPullDownRefresh() {
			await this.initData();
			uni.stopPullDownRefresh();
		},
		// 页面处理函数--监听用户上拉触底
		onReachBottom() {
			uni.stopPullDownRefresh();
		},
		// 监听自定义标题栏按钮事件
		onNavigationBarButtonTap(e) {
			this.toMessage();
		},
	},
};
</script>

<style lang="scss" scoped>
.warp {
	background: #efefef;
	overflow: hidden;
}

.u-card /deep/ {
	.u-card__head {
		padding: 20rpx !important;
	}

	.u-card__body {
		padding: 10rpx !important;
	}

	.u-grid-item-box {
		padding: 0 !important;
	}

	.u-badge {
		top: 5px !important;
		right: 15px !important;
	}
}

.grid-item-box {
	flex: 1;
	/* position: relative;
	*/
	/* #ifndef APP-NVUE */
	display: flex;
	/* #endif */
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 5px 0;
}

.text {
	margin-top: 10rpx;
	font-size: 12px;
}

.my-popup /deep/ .u-close--top-right {
	top: 20rpx !important;
}

.menu-item {
	font-size: 22rpx;
	text-align: center;
}
</style>
